<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录</title>
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <link rel="icon" href="jpg/favicon.ico" type="image/x-icon">
</head>

<style>
    .logincenter {
        text-align: center;

    }

    .btn1 {
        margin-left: 145px;
    }

    .btn2 {
        margin-left: 115px;
    }

    .form-group {
        margin-top: 20px;
    }

    body {
        background-image: url(/jpg/7.jpg);

    }

    .row {
        opacity: 0.4;
    }

    .div_foot {
        text-align: center;
        height: 100px;
        width: 100%;
        position: fixed;
        bottom: -1;
    }
</style>

<body>



    <div class="row align-items-center" style="height: 40rem;">
        <div class="col">


        </div>
        <div class="col">

            <!-- <div class="card shadow rounded" style="width: 37rem;"> -->

            <div class="card" style="width: 37rem;">
                <div class="card-body">
                    <h2 class="logincenter"> 登录中心 </h2>
                    <form id="form1" method="POST" action="/loginDone">
                        <div class="form-group">
                            <label for="formGroupExampleInput">用户名</label>
                            <input type="text" class="form-control" id="username" name="username" placeholder="请输入您的账号">
                        </div>
                        <div class="form-group">
                            <label for="formGroupExampleInput2">密码</label>
                            <input type="password" class="form-control" id="password" name="password"
                                placeholder="请输入您的密码">
                        </div>
                    </form>

                    <button type="button" class="btn1 btn-primary btn-lg" onclick="login()">登录</button>
                    <button type="button" class="btn2 btn-secondary btn-lg" onclick="jump1()">注册</button>
                </div>
            </div>


            <!-- </div> -->
        </div>
        <div class="col">


        </div>

    </div>



    </div>


    </div>


    <div class="div_foot">
        <a style="color:pink">
            2021-2022©Lucas科技有限公司
        </a>

        <a href="https://beian.miit.gov.cn/" style="text-decoration:none; color: pink; margin-left: 30px;">
            赣ICP备2020013193号-1
        </a>

        <a target="_blank" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=35080202351206"
            style="display:inline-block;text-decoration:none;height:20px;line-height:20px; margin-left: 80px;"><img
                src="/jpg/备案图标.png" style="float:left;" />

            <a href="https://beian.miit.gov.cn/" style="text-decoration:none; color:pink ">
                闽公网安备 35080202351206号
            </a>

    </div>





    <script src="/js/jquery-3.6.0.min.js">

    </script>

    <script src="/js/bootstrap.min.js">

    </script>

    <script>
        //跳转到注册界面
        function jump1() {
            window.location.href = "/register";
        }

        function login() {
            //ajax实现提交表单
            let username = $("#username").val();
            let password = $("#password").val();

            if (username.length > 0 && password.length > 0) {
                $.ajax({
                    //几个参数需要注意一下
                    type: "POST",//方法类型
                    dataType: "json",//预期服务器返回的数据类型
                    url: "/loginDone",//url
                    data: $('#form1').serialize(),  //同请求发送到服务器
                    success: function (result2) {
                        console.log(result2);//打印服务端返回的数据(调试用)
                        if (result2.resultCode == 200) {
                            //管理员登录账号密码
                            if (username === "milu" && password === '1') {
                                window.location.href = "/homepage"
                            }else{
                            //普通用户登录跳转前台界面
                                window.location.href = "/frontdesk"
                            }
                        } else {
                            alert(result2.msg);
                        }

                    },
                    error: function () {
                        alert("网络异常！");
                    }
                });

            } else {
                alert("账号或密码信息未填写")
            }

        }


        /* 鼠标特效 */
        var a_idx = 0;
        jQuery(document).ready(function ($) {
            $("body").click(function (e) {
                var a = new Array("❤看❤", "❤看❤", "❤好啦❤", "❤你的❤", "❤男神❤", "❤小鹿❤", "❤在❤", "❤写❤", "❤微❤", "❤说❤", "❤说❤", "❤项目❤");
                var $i = $("<span></span>").text(a[a_idx]);
                a_idx = (a_idx + 1) % a.length;
                var x = e.pageX,
                    y = e.pageY;
                $i.css({
                    "z-index": 999999999999999999999999999999999999999999999999999999999999999999999,
                    "top": y - 20,
                    "left": x,
                    "position": "absolute",
                    "font-weight": "bold",
                    "color": "rgb(" + ~~(255 * Math.random()) + "," + ~~(255 * Math.random()) + "," + ~~(255 * Math.random()) + ")"
                });
                $("body").append($i);
                $i.animate({
                    "top": y - 180,
                    "opacity": 0
                },
                    1500,
                    function () {
                        $i.remove();
                    });
            });
        });

    </script>
</body>

</html>